<!-- directive:title 表格插件1.4 改进任礼游表格结构 -->
<!-- directive:breadcrumb 表格插件1.4 -->
<div class='panel-body'>
    <form name="MakeFrom">
        <table>
            <thead> <tr> <th>tab标签::名称</th> <th>链接</th> <th>是不是本页面</th> <th style="text-align:center;color:#4CAF50;" title="添加"> <div ng-click="addItem('tab')"> <i class="fa fa-plus"></i> </div></th> </tr> </thead>
            <tbody>
                <tr ng-show="! fromObj.tab.length">
                    <td colspan="99"><center>无数据</center></td>
                </tr>
                <tr ng-repeat="row in fromObj.tab track by $index">
                    <td ><input type="text" placeholder="请输入" style="width:150px;" ng-model="row.title"></td>
                    <td><input type="text" placeholder="请输入" style="width:250px;" ng-model="row.link"></td>
                    <td><input type="radio" name="tabName" ng-model="row.me"></td>
                    <td style="text-align:center;color:#F44336;" title="关闭"><div ng-click="removeItem('tab', $index)"> <i class="fa fa-close"></i> </div></td>
                </tr>
            </tbody>
        </table>
        <table>
            <thead> <tr> <th>搜索框内容::名称</th> <th>标题</th> <th>类型</th> <th>可搜索</th> <th>api</th> <th style="text-align:center;color:#4CAF50;" title="添加"> <div ng-click="addItem('search')"> <i class="fa fa-plus"></i> </div></th> </tr> </thead>
            <tbody>
                <tr ng-show="! fromObj.search.length">
                    <td colspan="99"><center>无数据</center></td>
                </tr>
                <tr ng-repeat="row in fromObj.search track by $index">
                    <td> <input type="text" placeholder="请输入" style="width:150px;" ng-model="row.title"></td>
                    <td> <input type="text" placeholder="请输入" style="width:150px;" ng-model="row.name"></td>
                    <td> <select placeholder="请输入" style="width:100px;" ng-model="row.type"> <option value="日期范围">日期范围</option> <option value="下拉框">下拉框</option> <option value="文本框">文本框</option> </select> </td>
                    <td style="text-align:center"><input ng-if="row.type=='下拉框'" type="checkbox" ng-model="row.dropSearch"></td>
                    <td> <input ng-if="row.type=='下拉框'" type="text" placeholder="请输入" style="width:150px;" ng-model="row.api"></td>
                    <td style="text-align:center;color:#F44336;" title="关闭"> <div ng-click="removeItem('search', $index)"> <i class="fa fa-close"></i> </div></td>
                </tr>
            </tbody>
        </table>
        <table>
            <thead> <tr> <th>搜索附加项::按钮名称</th> <th>标题</th> <th>触发方式</th> <th style="text-align:center;color:#4CAF50;" title="添加"> <div ng-click="addItem('searchBtn')"> <i class="fa fa-plus"></i> </div></th> </tr> </thead>
            <tbody>
                <tr ng-show="! fromObj.searchBtn.length">
                    <td colspan="99"><center>无数据</center></td>
                </tr>
                <tr ng-repeat="row in fromObj.searchBtn track by $index">
                    <td> <input type="text" placeholder="请输入" style="width:150px;" ng-model="row.title"></td>
                    <td> <input type="text" placeholder="请输入" style="width:150px;" ng-model="row.name"></td>
                    <td> <select placeholder="请输入" style="width:100px;" ng-model="row.func"> <option value="确认">二次确认</option> <option value="跳转">跳转</option>  <option value="下载">下载</option> <option value="弹框">弹框</option> </select> </td>
                    <td style="text-align:center;color:#F44336;" title="关闭"><div ng-click="removeItem('searchBtn', $index)"> <i class="fa fa-close"></i> </div></td>
                </tr>
            </tbody>
        </table>
        <table>
            <thead> <tr> <th>表格列内容::名称</th> <th>标题</th> <th>类型</th> <th>假数据类型</th> <th>参数</th> <th>汇总数据</th> <th style="text-align:center;color:#4CAF50;" title="添加"> <div ng-click="addItem('tableColume')"> <i class="fa fa-plus"></i> </div></th> </tr> </thead>
            <tbody>
                <tr ng-show="! fromObj.tableColume.length">
                    <td colspan="99"><center>无数据</center></td>
                </tr>
                <tr ng-repeat="row in fromObj.tableColume track by $index">
                    <td> <input type="text" placeholder="请输入" style="width:150px;" ng-model="row.title"></td>
                    <td> <input type="text" placeholder="请输入" style="width:150px;" ng-model="row.name"></td>
                    <td> <select placeholder="请输入" style="width:100px;" ng-model="row.type"> <option value="文本">文本</option> <option value="选择">选择</option> </select> </td>
                    <td> <select placeholder="请输入" style="width:100px;" ng-model="row.mock"> <option value="日期">日期</option> <option value="名字">名字</option> <option value="词语">词语</option> <option value="id">id</option> <option value="网址">网址</option> <option value="数字">数字</option> <option value="金钱">金钱</option> <option value="枚举2">枚举2</option> <option value="枚举3">枚举3</option></select> </td>
                    <td> <input ng-if="row.type=='选择'"  type="text" placeholder="请输入" style="width:300px;" ng-model="row.option"></td>
                    <td style="text-align:center"><input type="checkbox" ng-model="row.sum"></td>
                    <td style="text-align:center;color:#F44336;" title="关闭"><div ng-click="removeItem('tableColume', $index)"> <i class="fa fa-close"></i> </div></td>
                </tr>
            </tbody>
        </table>
        <table>
            <tbody>
                <tr>
                    <td>表格请求主要接口 <input type="text" placeholder="请输入" style="width:250px;" ng-model="fromObj.listApi.url"></td>
                </tr>
                <tr>
                    <td>表格请求代号名称 <input type="text" placeholder="请输入" style="width:250px;" ng-model="fromObj.listApi.api"></td>
                </tr>
            </tbody>
        </table>
        <table>
            <thead> <tr> <th>面包屑::名称</th> <th style="text-align:center;color:#4CAF50;" title="添加"> <div ng-click="addItem('level')"> <i class="fa fa-plus"></i> </div></th> </tr> </thead>
            <tbody>
                <tr ng-show="! fromObj.level.length">
                    <td colspan="99"><center>无数据</center></td>
                </tr>
                <tr ng-repeat="row in fromObj.level track by $index">
                    <td> <input type="text" placeholder="请输入" style="width:150px;" ng-model="row"></td>
                    <td style="text-align:center;color:#F44336;" title="关闭"><div ng-click="removeItem('level', $index)"> <i class="fa fa-close"></i> </div></td>
                </tr>
            </tbody>
        </table>
        <table>
            <thead> <tr> <th>操作列功能::按钮名称</th> <th>标题</th> <th>触发方式</th> <th style="text-align:center;color:#4CAF50;" title="添加"> <div ng-click="addItem('opBtn')"> <i class="fa fa-plus"></i> </div></th> </tr> </thead>
            <tbody>
                <tr ng-show="! fromObj.opBtn.length">
                    <td colspan="99"><center>无数据</center></td>
                </tr>
                <tr ng-repeat="row in fromObj.opBtn track by $index">
                    <td> <input type="text" placeholder="请输入" style="width:150px;" ng-model="row.title"></td>
                    <td> <input type="text" placeholder="请输入" style="width:150px;" ng-model="row.name"></td>
                    <td> <select placeholder="请输入" style="width:100px;" ng-model="row.func"> <option value="确认">二次确认</option> <option value="跳转">跳转</option>  <option value="下载">下载</option> <option value="弹框">弹框</option> </select> </td>
                    <td style="text-align:center;color:#F44336;" title="关闭"><div ng-click="removeItem('opBtn', $index)"> <i class="fa fa-close"></i> </div></td>
                </tr>
            </tbody>
        </table>
        <table>
            <thead> <tr> <th>下拉框API::按钮名称</th> <th>标题</th> <th>触发方式</th> <th style="text-align:center;color:#4CAF50;" title="添加"> <div ng-click="addItem('dropApi')"> <i class="fa fa-plus"></i> </div></th> </tr> </thead>
            <tbody>
                <tr ng-show="! fromObj.dropApi.length">
                    <td colspan="99"><center>无数据</center></td>
                </tr>
                <tr ng-repeat="row in fromObj.dropApi track by $index">
                    <td> <input type="text" placeholder="请输入" style="width:150px;" ng-model="row.title"></td>
                    <td> <input type="text" placeholder="请输入" style="width:150px;" ng-model="row.api"></td>
                    <td> <input type="text" placeholder="请输入" style="width:150px;" ng-model="row.url"></td>
                    <td> <input type="text" placeholder="请输入" style="width:350px;" ng-model="row.staticData"></td>
                    <td style="text-align:center;color:#F44336;" title="关闭"><div ng-click="removeItem('dropApi', $index)"> <i class="fa fa-close"></i> </div></td>
                </tr>
            </tbody>
        </table>
    </form>
    <dc-json json="fromObj" collapsed="true"></dc-json >
    <button class="btn btn-success" ng-click="produceCode()">
        <i class="glyphicon glyphicon-plus"></i>生产表格代码
    </button>
    <button class="btn btn-danger" ng-click="makeCodeFile()">
        <i class="glyphicon glyphicon-plus"></i>生产文件 (需要服务器配合)
    </button>
    <button class="btn btn-success" ng-click="produceFromCode()">
        <i class="glyphicon glyphicon-plus"></i>生产表单代码
    </button>
    <div class="yxt14" id="jsonMakeTable"></div>
    <pre id="templateH"></pre>
    <pre id="templateJ"></pre>
    <pre id="templateA"></pre>
    <pre id="templateAPI"></pre>
    <pre id="templateF"></pre>
    <form class="yxf14" name="From" id="jsonMakeFrom"></form>
    <pre id="templateF"></pre>
</div>